<template>
  <van-nav-bar :border="false" safe-area-inset-top @click-left="onClickLeft" class="bar" fixed id="vannavbar">
    <template #title>
      <b style="color: #fff">职位详情</b>
    </template>
    <template #left>
      <div style="color: #fff">返回</div>
    </template>
  </van-nav-bar>
  <div id="vannavbarbot"></div>
  <div class="mian" v-if="isshow">
    <div class="topbj">
      <div class="tit">
        <div class="pad">
          <van-row>
            <van-col span="18">
              <div class="tit1">
                <van-notice-bar class="p0" color="#000" background="#fff">
                  <b class="f2">{{ jadtails.title }}</b>
                </van-notice-bar>
              </div>
              <div class="tit2">
                {{
                  jadtails.settlement +
                    " | " +
                    jadtails.jobAddress +
                    " | " +
                    jadtails.jobTime
                }}
              </div>
            </van-col>
            <van-col span="6" class="tit3 uuiu">
              <van-notice-bar class="p0" color="#ff5e2b" background="#fff">
                <b class="f1">{{ jadtails.price + jadtails.unit }}</b>
              </van-notice-bar>
            </van-col>
          </van-row>

          <div class="tit3" v-if="contacttype != '5'">
            <van-row justify="space-around">
              <van-col span="6" class="uuiu">
                <div class="poiop qqqqq1">{{ contacttype == "2" ? "微信公众号" : "联系方式" }}</div>
              </van-col>
              <van-col span="10" class="qqqqq">
                <div class="textov">
                  <img class="iconimg" v-if="istypeshow" :src="icons[contacttype]" />
                  <b>{{ contact ? contactqq(contact) : "⁕⁕⁕⁕⁕⁕⁕" }}</b>
                </div>
              </van-col>
              <van-col span="8" class="cpbtn">
                <div @click="ontoas" class="ybm but" :data-clipboard-text="contact">复制</div>
              </van-col>
            </van-row>
          </div>
          <div class="tit3" v-else>
            <van-row justify="space-around">
              <van-col span="10" class="uuiu">
                <div class="poiop qqqqq1 hen">
                  <svg t="1623047857580" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2602" width="18" height="18">
                    <path d="M958.2 341.6C827.6 122.3 683.2 11 528.9 11 283.1 11 98.6 290.8 67.2 341.6H1.4v312.9h148.8V341.6h-46.6c49.2-73.8 217.1-300.2 425.2-300.2 139.2 0 271.5 101.1 393.6 300.2h-47.2v312.9h62c-9.6 152.1-160.7 273.8-347.5 278.2-5.8-37.5-37.9-66.3-77-66.3-43.1 0-78.2 35.1-78.2 78.2s35.1 78.2 78.2 78.2c39.4 0 71.7-29.3 77.1-67.2 199.4-4.5 360.8-136.3 370.3-301h63.9v-313h-65.8z m-838.5 30.5V624H31.9V372.1h87.8z m393 627.7c-30.5 0-55.3-24.8-55.3-55.3 0-30.5 24.8-55.3 55.3-55.3 30.5 0 55.3 24.8 55.3 55.3 0 30.5-24.8 55.3-55.3 55.3zM993.5 624h-87.7V372.1h87.7V624z m0 0" fill="#323333" p-id="2603" />
                    <path d="M787.5 615l-22.9-20.1C574.4 812.2 386 680.7 324.1 637.5c-18.5-12.9-25.5-17.8-35.4-12.6l-8.6 14.4h18.1l-6.2 13.5c2.8 1.3 7.7 4.9 14.6 9.7 80.4 56.1 157 84.1 229.4 84.1 90.6 0 174.7-43.9 251.5-131.6z m-483.7 36.2l-5.4-12h12.1c0 4.8-2.6 9.4-6.7 12z m0 0" fill="#323333" p-id="2604" />
                  </svg>
                  <span style="margin-left: 5px;">在线客服</span>
                </div>
              </van-col>
              <van-col span="14" class="cpbtn">
                <div @click="onzxtoas(contact)" class="gifimg" v-if="gigimg">
                  <img src="../assets/details/01.gif" />
                </div>
                <div @click="onzxtoas(contact)" class="ybm but1" v-else>点击联系在线客服</div>
              </van-col>
            </van-row>
          </div>
        </div>
      </div>
    </div>
    <div class="detail">
      <div class="nav">
        <span class="navtxt1-o"></span>
        <span class="navtxt-o">职位描述</span>
      </div>
      <div class="deimg">
        <img v-if="contacttype == '2'" style="width:100%" src="../assets/details/gzh.jpg" />
      </div>
      <div class="pad html" v-html="jadtails.jobIntr"></div>
    </div>
    <div class="company">
      <div class="pad">
        <div class="nav">
          <span class="navtxt1-o"></span>
          <span class="navtxt-o">公司信息</span>
        </div>
        <div>
          <van-row class="companyinfo">
            <van-col span="3">
              <svg t="1610980781174" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1173" width="32" height="32">
                <path d="M920.689778 959.431111V116.167111L775.452444 0 292.067556 165.831111v41.472l439.011555-135.793778v948.792889h292.181333v-60.871111h-102.570666zM140.515556 750.933333l173.283555-42.268444v-107.235556l-173.283555 55.580445V750.933333z m0 211.740445l173.283555-20.48v-106.951111l-173.283555 35.498666v91.932445z m0-426.496L313.799111 477.866667V366.535111L140.515556 438.044444v98.076445z m479.744-276.935111L490.382222 186.595556 0.967111 348.615111 0.739556 1024h64.455111V381.326222L431.217778 270.620444V1020.586667h189.041778V259.185778z" fill="#CCCCCC" p-id="1174" />
              </svg>
            </van-col>
            <van-col span="17">
              <div class="ft12 gsmz">{{ company.companyName }}</div>

              <div class="ft12">
                综合评分
                <van-rate v-model="company.score" readonly :size="15" color="#ffd21e" void-icon="star" void-color="#eee" />
              </div>
            </van-col>
            <van-col span="4" class="sc">
              <svg t="1610981310294" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2058" width="28" height="28">
                <path d="M921.907046 143.8001c-12.281859-11.258371-28.657671-17.3993-45.033483-17.3993h-4.605697c-1.023488 0-11.770115 0.511744-28.145927 0.511744-27.634183 0-81.367316-2.046977-132.541729-13.817092-66.014993-15.864068-141.753123-88.01999-164.269865-102.348825a68.558361 68.558361 0 0 0-73.691155 0c-2.558721 2.046977-82.390805 84.437781-160.175912 102.860569-51.174413 12.281859-105.931034 13.817091-133.565217 13.817092-16.375812 0-27.122439-0.511744-28.145927-0.511744h-4.605697c-16.887556 0-33.263368 6.14093-45.545228 17.3993-13.305347 11.770115-20.981509 29.169415-20.981509 46.568716v160.175912c0 592.5997 400.695652 668.849575 417.583209 671.92004 4.093953 0.511744 7.676162 1.023488 11.770114 1.023488 4.093953 0 7.676162-0.511744 11.770115-1.023488 16.887556-3.070465 420.653673-79.32034 420.653674-671.92004V190.88056c0.511744-17.911044-7.164418-34.798601-20.469766-47.08046z m-147.894052 229.261369l-277.877062 268.665667c-1.535232 3.070465-4.093953 5.629185-6.652674 8.187906-8.187906 7.676162-18.934533 11.770115-29.681159 11.258371-10.746627 0-21.493253-3.582209-29.681159-11.258371-2.558721-2.558721-4.605697-5.117441-6.652674-8.187906l-148.405797-143.8001c-15.864068-15.352324-15.864068-39.916042 0-55.268365 15.864068-15.352324 41.451274-15.352324 57.315342 0l127.424288 123.330334L716.697651 317.793103c15.864068-15.352324 41.451274-15.352324 57.315343 0 15.352324 15.352324 15.352324 39.916042 0 55.268366z" fill="#3DCC32" p-id="2059" />
              </svg>
              <div class="ft12">已认证</div>
            </van-col>
          </van-row>

          <div class="ft12 og">
            <van-icon name="volume" />
            {{ bofang }}
          </div>
        </div>
      </div>
    </div>
    <!--  -->
    <div class="listtodo">
      <div class="nav">
        <span class="navtxt1-o"></span>
        <span class="navtxt-o">热门推荐</span>
      </div>

      <ProLiets :data="data" />
    </div>
    <table></table>
  </div>
  <van-empty description="暂无内容" v-else />

  <div id="tom"></div>
  <div class="botbtn footer" id="footertom">
    <van-row>
      <van-col span="10">
        <div class="btn1" v-if="jadtails.isCollect" @click="onCollect(false)">
          <van-icon name="star" color="#ffd21e" />已收藏
        </div>
        <div class="btn1" v-else @click="onCollect(true)">
          <van-icon name="star-o" />未收藏
        </div>
      </van-col>
      <van-col span="14" v-if="!jadtails.isBaoMin" @click="onBaoMin(true)">
        <div class="btn2">立即报名</div>
      </van-col>
      <van-col span="14" class="ybm" :data-clipboard-text="contact" v-else @click="ontoas">
        <div class="btn3">已报名,马上联系</div>
      </van-col>
    </van-row>
  </div>

  <van-overlay :show="show1">
    <div class="wrapper">
      <div class="block">
        <div class="wrappe">
          <div class="h150"></div>
          <div class="w100 ft-18">恭喜您报名成功</div>
          <div v-if="contacttype != '5'">
            <div class="w100 ft-181 iconsz">
              <div v-if="istypeshow">
                <img :src="icons[contacttype]" />
              </div>
              <div>联系方式</div>
            </div>
            <div class="w100 fred">{{ contactqq(contact) }}</div>
            <div class="w100" v-if="istypeshow">
              <van-button type="warning" class="copy-btn" :data-clipboard-text="contact" @click="copy">点击复制</van-button>
            </div>
          </div>
          <div v-else>
            <div class="w100" v-if="istypeshow">
              <van-button type="warning" class="copy-btn zxbut" @click="onzxtoas(contact)">点击联系在线客服</van-button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </van-overlay>
  <Overlay :show="show" />
</template>

<script>
import { Get, Post } from "@/api/axios";
import { reactive, ref, toRefs, onMounted } from "vue";
import { Toast, Dialog } from "vant";
import Clipboard from "clipboard";
import $router from "../../src/router/index";
import Overlay from "../components/Home/Overlay.vue";
import ProLiets from "../components/Home/ProLiets.vue";
import { onBeforeRouteUpdate, onBeforeRouteLeave } from "vue-router";
export default {
  name: "Details",
  components: {
    Overlay,
    ProLiets,
  },
  setup() {
    const jzdata = reactive({
      data: [],
      gigimg: window.gifimg,
    });

    let bofang = window.bofang;

    const contactqq = (qq) => {
      if (qq == "今日报名已满") return qq;
      var lastFour = qq.slice(0, parseInt(qq.length / 2 + 1));
      var newArr = lastFour + new Array(parseInt(qq.length / 2)).join("*");
      return newArr;
    };

    const onzxtoas = (url) => {
      const phoneType = localStorage.getItem("phoneType");
      if (phoneType == "iOS") {
        Post({
          url: "index/clickCopy",
          data: {
            id: data1.copyid,
            platform: "ios",
            imei: JSON.stringify({ idfa: localStorage.getItem("idfa") }),
          },
          headers: { token: localStorage.getItem("token") },
        });
      }
      if (phoneType == "Android") {
        Post({
          url: "index/clickCopy",
          data: {
            id: data1.copyid,
            platform: "android",
            imei: localStorage.getItem("imei"),
          },
          headers: { token: localStorage.getItem("token") },
        });
      }
      if (phoneType == "web") {
        Post({
          url: "index/clickCopy",
          data: {
            id: data1.copyid,
            platform: "web",
            imei: localStorage.getItem("imei"),
          },
          headers: { token: localStorage.getItem("token") },
        });
      }
      if (!phoneType) {
        Post({
          url: "index/clickCopy",
          data: {
            id: data1.copyid,
          },
          headers: { token: localStorage.getItem("token") },
        });
      }
      $router.push({
        path: "/Iframe",
        query: { url, adv: true },
      });
    };

    onMounted(() => {
      const tabbar = document.getElementById("footertom");
      const vannavbar = document.getElementById("vannavbar");
      const btm = document.getElementById("tom");
      const vannavbarbot = document.getElementById("vannavbarbot");
      setTimeout(() => {
        btm.style.height = tabbar.clientHeight + "px";
        vannavbarbot.style.height = vannavbar.clientHeight + "px";
      }, 300);
    });

    onBeforeRouteUpdate((to) => {
      data1.contact = "";
      window.scrollTo(0, 0);
      getjz();
      getdtail(to.query.id);
    });

    const show1 = ref(false);
    const data1 = reactive({
      show: false,
      jadtails: {},
      company: {},
      isBaoMin: null,
      contact: "",
      copyid: "",
      contacttype: 0,
      isshow: false,
      istypeshow: false,
    });
    let icons = [
      require("../assets/details/QQ.png"),
      require("../assets/details/wx.png"),
      require("../assets/details/wx.png"),
      require("../assets/details/phone.png"),
    ];

    const getjz = async () => {
      const data = await Get({
        url: "index/randomGetWorkList",
      });
      jzdata.data = data.data.data;
    };
    getjz();

    const getdtail = async (id) => {
      let userid = localStorage.getItem("usedata")
        ? JSON.parse(localStorage.getItem("usedata"))._id
        : false;

      const phoneType = localStorage.getItem("phoneType");
      let dtailinfo = {};
      if (phoneType == "iOS") {
        dtailinfo = {
          id,
          platform: "ios",
          imei: JSON.stringify({ idfa: localStorage.getItem("idfa") }),
          userid,
        };
      }
      if (phoneType == "web") {
        dtailinfo = {
          id,
          platform: "web",
          imei: localStorage.getItem("imei"),
          userid,
        };
      }
      if (phoneType == "Android") {
        dtailinfo = {
          id,
          platform: "android",
          imei: localStorage.getItem("imei"),
          userid,
        };
      }
      if (!phoneType) {
        dtailinfo = {
          id,
          userid,
        };
      }
      try {
        data1.show = true;
        const data = await Post({
          url: "/index/getWorkDetails",
          data: dtailinfo,
        });

        data1.show = false;
        data1.isshow = true;
        data1.jadtails = data.data.data;
        if (data.data.contact) {
          data1.contact = data.data.contact.contact;
          data1.contacttype = data.data.contact.type;
          data1.copyid = data.data.contact.id;
        }
        switch (data1.contacttype) {
          case 4:
            data1.istypeshow = false;
            break;
          default:
            data1.istypeshow = true;
            break;
        }
        data1.isBaoMin = data.data.isBaoMin;
        data1.company = data.data.data.companyData;
      } catch (error) {
        Toast(error.data.message);
      }
    };

    let jzid = $router.currentRoute.value.query.id;
    getdtail(jzid);
    let timer = null;
    const onCollect = (inbol) => {
      if (timer) {
        clearTimeout(timer);
      }
      timer = setTimeout(async () => {
        let userinfo = localStorage.getItem("usedata");
        if (!userinfo) {
          $router.push("/login");
        } else {
          if (inbol) {
            let oncollect = await Post({
              url: "/index/collect",
              data: { id: jzid },
              headers: { token: localStorage.getItem("token") },
            });
            if (oncollect.data.code === 200) {
              data1.jadtails.isCollect = true;
            }
            // console.log(jzid);
          } else {
            unCollect();
          }
        }
      }, 500);
    };
    const unCollect = async () => {
      let oncollect = await Post({
        url: "/index/cancelCollect",
        data: { id: jzid },
        headers: { token: localStorage.getItem("token") },
      });
      if (oncollect.data.code === 200) {
        data1.jadtails.isCollect = false;

        // console.log(jzid);
      }
    };

    const onBaoMin = async (inbol) => {
      let userinfo = localStorage.getItem("usedata");
      if (!userinfo) {
        $router.push("/login");
      } else {
        if (inbol) {
          const phoneType = localStorage.getItem("phoneType");
          let bmdata = {};
          if (phoneType == "iOS") {
            bmdata = {
              id: jzid,
              platform: "ios",
              imei: JSON.stringify({ idfa: localStorage.getItem("idfa") }),
            };
          }
          if (phoneType == "Android") {
            bmdata = {
              id: jzid,
              platform: "android",
              imei: localStorage.getItem("imei"),
            };
          }
          if (phoneType == "web") {
            bmdata = {
              id: jzid,
              platform: "web",
              imei: localStorage.getItem("imei"),
            };
          }
          if (!phoneType) {
            bmdata = {
              id: jzid,
            };
          }

          let oncollect = await Post({
            url: "/index/entryWork",
            data: bmdata,
            headers: { token: localStorage.getItem("token") },
          });

          if (oncollect.data.code == 200) {
            show1.value = true;
            data1.jadtails.isBaoMin = true;
            switch (data1.contacttype) {
              case 4:
                data1.istypeshow = false;
                break;
              default:
                data1.istypeshow = true;
                break;
            }
          }
          // console.log(jzid);
        }
      }
    };

    const ontoas = () => {
      let clipboard = new Clipboard(".ybm");
      clipboard.on("success", () => {
        if (data1.contacttype == 0) {
          Toast(`复制成功~`);
          data1.show = true;
          openQQ();
        } else if (data1.contacttype == 1 || data1.contacttype == 2) {
          Toast(`复制成功~`);
          data1.show = true;
          openWX();
        } else if (data1.contacttype == 3) {
          Dialog.alert({
            message: "手机号复制成功,马上拨打电话",
          }).then(() => {
            window.location.href = `tel:${data1.contact}`;
          });
        } else if (data1.contacttype == 4) {
          Toast(data1.contact);
        } else if (data1.contacttype == 5) {
          $router.push({
            path: "/Iframe",
            query: { url: data1.contact, adv: true },
          });
        }

        const phoneType = localStorage.getItem("phoneType");
        if (phoneType == "iOS") {
          Post({
            url: "index/clickCopy",
            data: {
              id: data1.copyid,
              platform: "ios",
              imei: JSON.stringify({ idfa: localStorage.getItem("idfa") }),
            },
            headers: { token: localStorage.getItem("token") },
          });
        }
        if (phoneType == "Android") {
          Post({
            url: "index/clickCopy",
            data: {
              id: data1.copyid,
              platform: "android",
              imei: localStorage.getItem("imei"),
            },
            headers: { token: localStorage.getItem("token") },
          });
        }
        if (phoneType == "web") {
          Post({
            url: "index/clickCopy",
            data: {
              id: data1.copyid,
              platform: "web",
              imei: localStorage.getItem("imei"),
            },
            headers: { token: localStorage.getItem("token") },
          });
        }
        if (!phoneType) {
          Post({
            url: "index/clickCopy",
            data: {
              id: data1.copyid,
            },
            headers: { token: localStorage.getItem("token") },
          });
        }
        clipboard.destroy(); // 释放内存
      });

      clipboard.on("error", () => {
        Toast("该浏览器不支持自动复制");
        clipboard.destroy(); // 释放内存
      });
    };

    const clicktz = () => {
      const phoneType = localStorage.getItem("phoneType");
      if (phoneType == "iOS") {
        Post({
          url: "index/clicktz",
          data: {
            id: data1.copyid,
            platform: "ios",
            imei: JSON.stringify({ idfa: localStorage.getItem("idfa") }),
          },
          headers: { token: localStorage.getItem("token") },
        });
      }
      if (phoneType == "Android") {
        Post({
          url: "index/clicktz",
          data: {
            id: data1.copyid,
            platform: "android",
            imei: localStorage.getItem("imei"),
          },
          headers: { token: localStorage.getItem("token") },
        });
      }
      if (phoneType == "web") {
        Post({
          url: "index/clicktz",
          data: {
            id: data1.copyid,
            platform: "web",
            imei: localStorage.getItem("imei"),
          },
          headers: { token: localStorage.getItem("token") },
        });
      }
    };

    const copy = () => {
      let clipboard = new Clipboard(".copy-btn");
      clipboard.on("success", () => {
        show1.value = false;
        if (data1.contacttype == 0) {
          Toast(`复制成功~`);
          data1.show = true;
          openQQ();
        } else if (data1.contacttype == 1 || data1.contacttype == 2) {
          Toast(`复制成功~`);
          data1.show = true;
          openWX();
        } else if (data1.contacttype == 3) {
          Dialog.alert({
            message: "手机号复制成功,马上拨打电话",
          }).then(() => {
            window.location.href = `tel:${data1.contact}`;
          });
        } else if (data1.contacttype == 4) {
          Toast(data1.contact);
        }

        const phoneType = localStorage.getItem("phoneType");
        if (phoneType == "iOS") {
          Post({
            url: "index/clickCopy",
            data: {
              id: data1.copyid,
              platform: "ios",
              imei: JSON.stringify({ idfa: localStorage.getItem("idfa") }),
            },
            headers: { token: localStorage.getItem("token") },
          });
        }
        if (phoneType == "Android") {
          Post({
            url: "index/clickCopy",
            data: {
              id: data1.copyid,
              platform: "android",
              imei: localStorage.getItem("imei"),
            },
            headers: { token: localStorage.getItem("token") },
          });
        }
        if (phoneType == "web") {
          Post({
            url: "index/clickCopy",
            data: {
              id: data1.copyid,
              platform: "web",
              imei: localStorage.getItem("imei"),
            },
            headers: { token: localStorage.getItem("token") },
          });
        }
        if (!phoneType) {
          Post({
            url: "index/clickCopy",
            data: {
              id: data1.copyid,
            },
            headers: { token: localStorage.getItem("token") },
          });
        }
        clipboard.destroy(); // 释放内存
      });
      clipboard.on("error", () => {
        Toast("该浏览器不支持自动复制");
        clipboard.destroy(); // 释放内存
      });
    };

    const openQQ = () => {
      data1.show = false;
      let urlcard = `mqqapi://card/show_pslcard?src_type=internal&version=1&uin=${data1.contact}&card_type=person&source=qrcode`;
      let url = `mqqwpa://im/chat?chat_type=wpa&uin=${data1.contact}&version=1&src_type=web`;
      let urlliaot = `mqqwpa://im/chat?chat_type=crm&uin=${data1.contact}&version=1&src_type=web`;

      const phoneType = localStorage.getItem("phoneType");
      if (phoneType == "Android" || phoneType == "web") {
        switch (window.iscard) {
          case 1:
            if (window.plus) {
              window.plus.runtime.openURL(urlcard, () => {
                clicktz();
                Toast(`复制成功,请手动前往添加..`);
              });
            } else {
              window.location.href = urlcard;
            }
            break;
          case 2:
            if (window.plus) {
              window.plus.runtime.openURL(urlliaot, () => {
                clicktz();
                Toast(`复制成功,请手动前往添加..`);
              });
            } else {
              window.location.href = urlliaot;
            }
            break;

          case 3:
            if (window.plus) {
              window.plus.runtime.openURL(url, () => {
                clicktz();
                Toast(`复制成功,请手动前往添加..`);
              });
            } else {
              window.location.href = url;
            }
            break;
        }
      }

      if (phoneType == "iOS") {
        if (window.plus) {
          window.plus.runtime.launchApplication(
            {
              action: `mqq://`,
            },
            () => {
              clicktz();
              Toast(`复制成功,请手动前往添加..`);
            }
          );
        } else {
          window.location.href = "mqq://";
        }
      }
    };

    const openWX = () => {
      data1.show = false;

      const phoneType = localStorage.getItem("phoneType");
      if (phoneType == "Android" || phoneType == "web") {
        if (window.plus) {
          window.plus.runtime.launchApplication(
            {
              pname: "com.tencent.mm",
            },
            () => {
              clicktz();
              Toast(`复制成功,请手动前往添加..`);
            }
          );
        } else {
          window.location.href = "weixin://";
        }
      }

      if (phoneType == "iOS") {
        if (window.plus) {
          window.plus.runtime.launchApplication(
            {
              action: `weixin://`,
            },
            () => {
              clicktz();
              Toast(`复制成功,请手动前往添加..`);
            }
          );
        } else {
          window.location.href = "weixin://";
        }
      }
    };

    let iscopy = true;
    onBeforeRouteLeave((to) => {
      if (data1.jadtails.isBaoMin) {
        if (to.path == "/home" && iscopy) {
          Dialog.confirm({
            title: "温馨提示",
            message:
              data1.contacttype == 5
                ? "请您确认是否已联系在线客服"
                : "请您确认是否已添加雇主联系方式",
            cancelButtonText: data1.contacttype == 5 ? "已联系" : "已添加",
            confirmButtonText:
              data1.contacttype == 5 ? "联系在线客服" : "添加并联系",
            width: "320px",
          })
            .then(() => {
              if (data1.contacttype == 0) {
                openQQ();
              } else if (data1.contacttype == 1 || data1.contacttype == 2) {
                openWX();
              } else if (data1.contacttype == 3) {
                window.location.href = `tel:${data1.contact}`;
              } else if (data1.contacttype == 4) {
                Toast(data1.contact);
              } else if (data1.contacttype == 5) {
                $router.push({
                  path: "/Iframe",
                  query: { url: data1.contact, adv: true },
                });
              }
            })
            .catch(() => {
              iscopy = false;
              $router.push("/home");
            });
          return false;
        }
      }
    });

    return {
      show1,
      ...toRefs(data1),
      ...toRefs(jzdata),
      onCollect,
      onBaoMin,
      ontoas,
      copy,
      icons,
      openQQ,
      contactqq,
      bofang,
      onzxtoas,
    };
  },

  methods: {
    onClickLeft() {
      $router.push("/home");
    },
  },
};
</script>

<style lang="scss" scoped>
.zxbut {
  width: 155px !important;
  margin-top: 30px;
}
.textov {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 140px;
}
#vannavbar,
#vannavbarbot {
  height: 45px;
  // background-image:   url("https://jimgs.oss-accelerate.aliyuncs.com/details/bj.png");
  background-image: url("../assets/details/bj.png");
}
.deimg {
  width: 94%;
  margin: 10px auto;
  padding: 5px 0;
}
.footer {
  background: white;
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);
}
.wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.block {
  width: 320px;
  height: 320px;
  // background-color: #fff;
  // background-image: url("https://jimgs.oss-accelerate.aliyuncs.com/details/tc.png");
  background-image: url("../assets/details/tc.png");
  background-size: 100% 100%;
}
.mian {
  background: #f0f1f3;
  min-height: calc(100vh-20px);
  min-height: 100%;
}
.pad {
  padding: 10px;
}
.bar {
  color: #fff;
  background: transparent;
}
.topbj {
  height: 155px;
  // background-image: url("https://jimgs.oss-accelerate.aliyuncs.com/details/bj.png");
  background-image: url("../assets/details/bj.png");
  background-size: 100% 100%;
}
.tit {
  width: 94%;
  margin: 0 auto;
  // height: 116px;
  background: #fff;
  border-radius: 10px;
  .tit1 {
    font-size: 18px;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .tit2 {
    font-size: 14px;
    margin: 0px 0 5px;
    color: #a4a4a4;
  }

  .tit3 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 20px;
    color: #ff5e2b;
    .van-row {
      align-items: center;
    }
    .uuiu {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .qqqqq {
      color: red;
      text-align: center;
      font-size: 16px;
      height: 34px;
      line-height: 34px;
      display: flex;
      align-items: center;
      justify-content: center;
      .iconimg {
        width: 15px;
        margin-right: 3px;
      }
    }
    .qqqqq1 {
      font-size: 16px;
      height: 34px;
      line-height: 34px;
    }
    .cpbtn {
      text-align: center;
      .but {
        margin: 0 auto;
        width: 85px;
        border-radius: 50px;
        background: #2fa7f7;
        height: 25px;
        color: white;
        line-height: 27px;
        font-size: 13px;
      }
      .but1 {
        margin: 0 auto;
        width: 85%;
        border-radius: 50px;
        // background: #2fa7f7;
        background: #ff5e2b;
        height: 25px;
        color: white;
        line-height: 27px;
        font-size: 13px;
        padding: 2px 0;
      }
    }
  }
}
.gsmz {
  font-weight: 700;
}
.detail {
  width: 94%;
  // min-height: 420px;
  margin: 0 auto;
  background: rgb(255, 255, 255);
  border-radius: 10px;
  margin-top: -20px;
  margin-bottom: 10px;
  font-size: 14px !important;
  color: black !important;
  white-space: normal;
  p {
    margin: 0 !important;
    padding: 0 !important;
  }
  .nav {
    font-size: 18px;
    margin: 0 auto;
    padding: 10px 10px 0 10px;
    .navtxt1-o {
      border-left: #ff5e2b 3px solid;
    }
    .navtxt-o {
      padding-left: 5px;
      font-size: 18px;
      font-weight: 600;
      color: #ff5e2b;
    }
  }
  .html {
    padding-top: 0;
  }
}
svg {
  vertical-align: middle;
}

.botbtn {
  position: fixed;
  width: 100%;
  bottom: 0;
  font-size: 16px;
  .btn1 {
    background: #fff;
    padding: 15px;
    text-align: center;
  }
  .btn2 {
    background: #ff5e2b;
    color: #fff;
    padding: 15px;
    text-align: center;
  }
  .btn3 {
    background: #64696d;
    color: #fff;
    padding: 15px;
    text-align: center;
  }
}
.company {
  width: 94%;
  margin: 0 auto;
  background: rgb(255, 255, 255);
  border-radius: 10px;
  .nav {
    font-size: 18px;
    margin: 0 auto;
    .navtxt1-o {
      border-left: #ff5e2b 2px solid;
    }
    .navtxt-o {
      padding-left: 5px;
      font-size: 16px;
    }
  }
}
.ft12 {
  font-size: 12px;
  margin: 2px 0;
}
.ft14 {
  font-size: 15px;
  // margin: 2px 0;
}
.f1 {
  font-size: 18px;
}
.f2 {
  font-size: 18px;
}
.p0 {
  padding: 0;
}
.og {
  color: #ff5e2b;
}
.tom {
  height: 50px;
}
.center {
  text-align: center;
}
.copy {
  font-size: 16px;
  color: #fff;
  background: #ff5e2b;
  border-radius: 10px;
  height: 26px;
  line-height: 26px;
}

.w100 {
  text-align: center;
  width: 100%;
  margin: 8px 0;
}
.h150 {
  height: 120px;
}
.ft-14 {
  font-size: 14px;
}
.ft-18 {
  font-size: 18px;
  color: #ff5e2b;
  margin: 3px;
}
.ft-181 {
  font-size: 15px;
}
.fred {
  color: red;
  font-size: 22px;
}
.copy-btn {
  width: 120px;
  border-radius: 8px;
  height: 35px;
  line-height: 35px;
}
.iconsz {
  vertical-align: middle;
  display: flex;
  justify-content: center;
  align-items: center;
  div {
    margin: 0 5px;
  }
  img {
    width: 20px;
  }
}
.listtodo {
  width: 94%;
  margin: 10px auto;
  padding: 5px 0;
  border-radius: 5px;
  background: #fff;
  .nav {
    width: 92%;
    font-size: 18px;
    margin: 0 auto;
    .navtxt1-o {
      border-left: #ff5e2b 3px solid;
    }
    .navtxt-o {
      padding-left: 5px;
      font-size: 18px;
      font-weight: 600;
      color: #ff5e2b;
    }
  }
}
.poiop {
  font-size: 16px;
  color: #000;
}
.companyinfo {
  margin: 10px 0 0 0;
}
.sc {
  text-align: center;
}
.hen {
  display: flex;
  align-items: center;
  font-weight: bold;
}
.gifimg {
  img {
    width: 100%;
  }
}
</style>